<template>
	<scroll-view scroll-y="true" class="goods_list_container" @scroll="handleScroll">
		<GoodsList ref="goodsList" :showType="searchType" :typeValue="searchTypeValue"/>
	</scroll-view>
</template>

<script setup>
import { ref } from "vue";
import { onLoad } from '@dcloudio/uni-app';
import GoodsList from "../../components/GoodsList/GoodsList.vue";

let goodsList = ref(null);
// 过滤类型值
let searchTypeValue = ref("");
// 过滤的类型
let searchType = ref("");

onLoad((options)=>{
	uni.setNavigationBarTitle({
		title:"搜索：" + options.navText
	})
	searchTypeValue.value = options.navText
	searchType.value = options.type
})

// 滚动监听是否触底，动态懒加载商品数据
function handleScroll(event) {
	const systemInfo = uni.getWindowInfo();
	const pageHeight = systemInfo.windowHeight; 
	const { scrollTop, scrollHeight } = event.target;
	// 判断是否滚动到底部
	if (scrollTop + pageHeight >= scrollHeight) {
		console.log("触底");
		console.log(goodsList.value);
		goodsList.value.loadMore(); // 调用子组件的方法进行懒加载
	}
}
</script>

<style lang="scss" scoped>
.goods_list_containerP{
	height: 100vh;
	overflow-y: auto;
}
</style>
